<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'jquerydailog.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type='text/javascript' src="<%=basePath %>/jquery/jquery-1.4.2.js"></script>
	<script type="text/javascript" src="<%=basePath%>/comm/js/map.js"></script>
	
	<link rel="stylesheet" href="<%=basePath %>/jquery/themes/base/jquery.ui.all.css">
	<link rel="stylesheet" href="<%=basePath %>/jquery/demos.css">
	<script src="<%=basePath %>/jquery/external/jquery.bgiframe-2.1.2.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.core.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.widget.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.mouse.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.draggable.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.position.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.resizable.js"></script>
	<script src="<%=basePath %>/jquery/ui/jquery.ui.dialog.js"></script>
	
	
	<script>
	
	$(function() {
		$( "#dialog1" ).dialog();
	});
	function openFlowDialog(){
		$( "#dialog" ).dialog({ width: 800 },{ height: 600 });;
		$( "#dialog" ).attr('innerHTML',"载入数据中...");
		$.get("enterflow.action?kind=FLOW.WAREHOUSE.RECEIPTLIST&kindid=13461", function(data){
			  //alert("Data Loaded: " + data);
			  
			  $( "#dialog" ).attr('innerHTML',data);
		});
		
		
	}

	function enterFlowDialog(url){
		$( "#dialog" ).dialog({ width: 800 },{ height: 600 });;
		$( "#dialog" ).attr('innerHTML',"载入数据中...");
		alert(url);
		$.get(url, function(data){
			  //alert("Data Loaded: " + data);
			  
			  $( "#dialog" ).attr('innerHTML',data);
		});
		
		
	}
	</script>
  </head>
  
<body>
<button onclick="openFlowDialog()">openFlowDialog</button>
<div class="demo">

<div id="dialog1" title="Basic dialog" class="width:800px;">
	<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<!-- Sample page content to illustrate the layering of the dialog -->
<div class="hiddenInViewSource" style="padding:20px;">
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
<form>
	<input value="text input" /><br />
	<input type="checkbox" />checkbox<br />
	<input type="radio" />radio<br />
	<select>
		<option>select</option>
	</select><br /><br />
	<textarea>textarea</textarea><br />
</form>
</div><!-- End sample page content -->

</div><!-- End demo -->



<div class="demo-description" >
<p >The basic dialog window is an overlay positioned within the viewport and is protected from page content (like select elements) shining through with an iframe.  It has a title bar and a content area, and can be moved, resized and closed with the 'x' icon by default.</p>
</div><!-- End demo-description -->

</body>
</html>
